<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div class="content">
        <style contenteditable style="display:block;white-space: pre;width: 90%;">
            * {
                transition: all 0.2s;
            }

            html {
                background: violet;
            }
        </style>
    </div>
    <!-- <script src="./call、apply、bind.js"></script> -->
    <script>
        /**
         * all 所有成功才then([1,2,3])
         * race 有一个成功就then(1)
         * allSettled 所有都执行完了才then([{status: "fulfilled", value: 1},{status: "rejected", reason: 2},{status: "fulfilled", value: 3}])
         */
        Promise.all([
            1,
            new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve(2)
                }, 1000);
            }),
            3,
            new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve(4)
                }, 2000);
            }),
            new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve(5)
                }, 2000);
            })
        ]).then(res => {
            console.log(res);
        })
    </script>
</body>

</html>